<template>
    <view
        v-if="content.data.length && content.enabled"
    >
        <u-swiper :list="swiperList(content.data)"
			height="590"
			effect3d
			effect3d-previous-margin="80"
			bgColor="transparent"
			@click="swiperClick"
			>
		</u-swiper>
    </view>
</template>

<script setup lang="ts">
import { useAppStore } from '@/stores/app'
import { navigateTo } from '@/utils/util'
import { computed } from 'vue'

const props = defineProps({
    content: {
        type: Object,
        default: () => ({})
    },
    styles: {
        type: Object,
        default: () => ({})
    }
})
const { getImageUrl } = useAppStore()

// 轮播list
const swiperList = computed(() => {
    return (list: any) => {
        return list.map((item: any) => {
                if (!item.image.includes('https://')) {
					item.image = getImageUrl(item.image)
                }
                return item
            }
        )
    }
})

// 轮播点击回调
const swiperClick = (index: number) => {
	const link = props.content.data[index].link
	handleClick(link)
}

const handleClick = (link: any) => {
	if (link.type == 'mini'){
		if (link.query?.appid){
			uni.navigateToMiniProgram({
			  appId: link.query?.appid,
			  path: link.path
			})
		}
	}else{
		navigateTo(link)
	}
}
</script>

<style></style>
